<template>
	<div class="alarmConfiguration zy-content">
		<back-level />
		<div class="alarmConfiguration">
			<div class="list-layout mt16">
				<div class="btns clear">
					<span class="title">生产领料详情列表</span>
				</div>
				<div class="tableContent">
					<Table
						class="resizable-table"
						border
						@on-column-width-resize="
							(a, b, c, d) => {
								onColumnWidthResize(a, b, c, d, 'orderAdjustmentDeviceInfo');
							}
						"
						:columns="orderAdjustmentDeviceInfoList"
						ellipsis
						ref="selection"
						stripe
						:data="dataArr"
						@on-selection-change="onSelectChange"
					>
						<template slot-scope="{ row }" slot="action">
							<span class="operationBtn" @click="linkUser(row)">关联用户</span>
						</template>
					</Table>
				</div>
				<!-- 分页 -->
				<div class="pageWrap mt16">
					<pageLeftTitle :total="total" :selected="delIds.length" />
					<Page
						:total="total"
						:page-size="pageSize"
						:page-size-opts="pageSizeOption"
						:current="pageNum"
						@on-change="changePageNum"
						@on-page-size-change="changePageSize"
						show-sizer
						show-total
					/>
				</div>
			</div>
		</div>
	</div>
</template>
<script>
import toggleTableOperation from '@/mixins/toggleTableOperation';
export default {
	name: 'productionMaterialManagementDetail',
	mixins: [toggleTableOperation],
	data() {
		return {
			columns: [
				{
					title: '序号',
					key: 'index',
					minWidth: 130,
					align: 'center',
					resizable: true,
					render: (h, params) => {
						return h('span', params.index + (this.pageNum - 1) * this.pageSize + 1);
					},
				},
				{
					title: '物料码',
					key: 'materialCode',
					minWidth: 100,
					align: 'center',
					resizable: true,
					tooltip: true,
				},
				{
					title: '追溯码',
					key: 'traceabilityCode',
					minWidth: 100,
					align: 'center',
					resizable: true,
					tooltip: true,
				},
				{
					title: '数量',
					key: 'quantity',
					minWidth: 100,
					align: 'center',
					resizable: true,
					tooltip: true,
				},
				{
					title: '模具编号',
					key: 'moldCode',
					minWidth: 100,
					align: 'center',
					resizable: true,
					tooltip: true,
				},
				{
					title: '模具名称',
					key: 'moldName',
					minWidth: 100,
					align: 'center',
					resizable: true,
					tooltip: true,
				},
				{
					title: '创建人名称',
					key: 'createName',
					minWidth: 100,
					align: 'center',
					resizable: true,
					tooltip: true,
				},
				{
					title: '创建时间',
					key: 'createTime',
					minWidth: 100,
					align: 'center',
					resizable: true,
					tooltip: true,
				},
			],
			loading: false,

			//一级页面分页参数
			pageNum: 1,
			pageSize: 10,
			total: 0,

			dataArr: [],

			pageSizeOption: [10, 20, 30, 40],
			delIds: [],
			selection: [],
			createByOptions: [],
		};
	},
	mounted() {
		// this.getTableColumnsWidth(this.columns);
		this.getTableColumnsWidth(this.columns, 'orderAdjustmentDeviceInfo');
		this.searchList();
	},
	methods: {
		reset() {
			this.searchParams = {};
			this.changeNum();
		},
		//分页
		changeNum() {
			this.pageNum = 1;
			this.searchList();
		},
		changePageSize(pageSize) {
			this.pageSize = pageSize;
			this.searchList();
		},
		changePageNum(val) {
			this.pageNum = val;
			this.searchList();
		},
		//查询列表
		searchList() {
			let params = {
				pageNum: this.pageNum,
				pageSize: this.pageSize,
				id:this.$route.query.id,
			};
			this.axios({
				url:'/dms/requisitionTask/queryRequisitionTaskDetailsList',
				method: 'get',
				params: params,
			}).then((res) => {
				if (res.code === 200) {
					this.dataArr = res.data.records;
					this.total = res.data.total;
				} else {
					this.$Message.warning({
						content: res.msg,
						duration: 6,
						closable: true,
					});
				}
			});
		},
	},
};
</script>

<style scoped lang="scss">
.ivu-input-number {
	width: -webkit-fill-available;
}

.btn-box {
	padding: 8px 5px !important;
}
</style>
